*, *:before, *:after {
  box-sizing: border-box;
	
}

html, body {
  height: 100%;
	font-family: "Source Han Sans CN";
}

body {
  background-color: #d0cfd8;
}

// 竖屏
@media screen and (orientation:portrait) {
  .is-mobile .landscape-show {
    display: none!important;
  }
}
.landscape-show {
  display: none;
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  > p {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 80%;
    transform: translate(-50%, -50%);
    font-size: 16px;
    text-align: center;
  }
}
// 横屏
@media screen and (orientation:landscape) {
  .is-mobile #app {
    display: none!important;
  }
  .is-mobile .landscape-show {
    display: block!important;
  }
}

#app {
  position: relative;
  height: 100%;
  overflow: hidden
}
#mobile {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  .comp {
    position: absolute !important;
  }
 
}
// .c-text{
//   padding:0 10px!important;
// }
.s-bg-main {
  background-color: $main_color;
	height:70px;
	border-bottom:1px solid #dbdee6;
}
.s-bg-sub {
  background-color: $sub_color;
}
.s-bg-gray {
  background-color: #f0f3f4;
}
.s-bg-white {
  background-color: #fff;
}

.h-from {
  .item {
    margin: 5px;
  }
}
.h-input {
  padding: 5px 10px;
  border: 1px solid #ddd;
  line-height: 1; 
}

.bgm-btn {
  position: absolute;
  right: 20px;
  top: 20px;
  z-index: 200;
  width: 30px;
  height: 30px;
  background-image: url(../bgmBtn-fbd2dc.svg);
  background-size: contain;
  background-repeat: no-repeat;
  &.rotate {
    -webkit-animation: rotating 1.2s linear infinite;
    animation: rotating 1.2s linear infinite;
  }
}

.swiper-container {
  height: 100%;
  .swiper-slide {
    overflow: hidden
  }
}

.container, .comp-lists {
  overflow: hidden!important;
  position: relative;
  width: 100%;
  height: 100%;
}
.comp {
  overflow: hidden;
  width: 100%;
  height: 100%;
}
// 选项卡重定义样式
.el-dialog__header {
    padding: 10px 20px 10px;
		border-bottom:1px solid #dbdee6;
	}
.el-dialog__headerbtn{
	top:10;
}
.el-tabs__item.is-active{
	color: #5c7aff;
}
.el-tabs__active-bar{
	background:#5c7aff;
}
.el-button--primary{
	background:#5c7aff;
	border-color: #5c7aff;
}
.el-button--primary:hover{
	background:#849bfe;
	border-color: #849bfe;
}
.el-dialog__headerbtn .el-dialog__close{
	color:#95989d;
}
.el-pager li.active{
	color: #5c7aff;
	&hover {
		color: #5c7aff!important;
	}
}
// 弹窗内左侧选项卡样式
.left-tab-dialog{
	.el-dialog__body{
		padding:20px;
		.el-tabs__item{
			text-align: left!important;
			width:130px;
			padding:0;
		}
		.el-tabs__item:hover{
			color:#849bfe;
		}
		.category-wrapper{
			margin-bottom:20px!important;
		}
	}
}

// 上传按钮
.el-upload-dragger {
		width: 123px;
		height: 36px;
		border: none;

		.el-button {
			border: 1px solid #5c7aff;
			color: #5c7aff;
			padding: 0;
			width: 100px;
			height: 30px;
			margin-right:2px;

		}

		.icon-tishi {
			color: #c0c4cc;
		}

		.icon-update {
			font-size: 14px;
			margin-right: 6px;
		}
	}
	.upload-demo {
		position: absolute;
		bottom: 11px;
	}
	
	.el-pagination {
		text-align: center;
	}
	
	.cate-list {
		width: 100%;
		border-bottom:1px solid #dbdee6!important;
	}
	.sub-list{
		height:auto!important;
	}
	
	.img-lists {
		width: 100%;
	}
.el-dialog__body{
	.el-tabs--left .el-tabs__header.is-left{
		margin-right:20px;
	}
	// 音乐列表
	.bgm-lists > li{
		padding: 3px 10px;
	}
	.bgm-lists > li:nth-child(2n + 1){
		background:#eff1f6;
	}
	.bgm-lists > li:hover{
		background:#849bfe;
		.origin{
			color:#fff;
		}
		.el-icon-service{
			color:#fff;
		}
	}
	.bgm-lists > li{
		.origin{
			color:#909399;
		}
		.el-icon-service{
			color:#909399;
		}
	}
	
}
.prop-manage > .mn{
		background: #f9fafd!important;
		.h-from:hover {
				background:#849bfe;
			}
	}

// 预览遮罩
.mask{
	width:100%;
	height:100%;
	background:rgba(0,0,0,0.7);
	position:fixed;
	z-index: 2500;
		
	}
.preview{
	position: relative;
	height: 100%;
	.icon-delete-two{
		position: absolute;
	    top: -120px;
	    right: -100px;
	    font-size: 48px!important;
	    color: #eff1f6;
	    cursor: pointer;
	}
}
.preview .comp{
	    position: absolute;
}

// 视频弹窗内间距
.video-dialog .el-dialog__body{
	padding:20px!important;
}
// 计数弹窗内图标
.count{
	.count-icon{
		margin-right:5px;
	}
	.el-color-picker{
		float:left;
		margin-top:1px;
		margin-right:10px;
	}
	.el-tabs--border-card>.el-tabs__content {
		display: none;
	
	}
	.el-tabs--border-card {
		box-shadow: none;
	}
	.el-input {
		float: left;
		width: 208px!important;
	}
	.label {
		float: left;
		margin: 0 20px 0 25px;
	}
	.btn-img {
		height: 115px;
		width: 115px;
		float: left;
	}
	.change-btn{
		float: left;
		margin-left:10px;
		margin-top: 83px;
	}
	.el-form {
		margin-top: 20px;
	}
	.el-radio-group {
		margin-right: 16px;
	}
	.el-dialog__body{
		padding:0!important;
	}
	.el-dialog__footer{
		padding-top:0!important;
	}
	.el-tabs__item{
		height:auto;
		padding:0;
		border:none!important;
		margin-top:10px!important;
	}
	.el-tabs__item  span{
		display:block;
		width:80px;
		height:30px;
		text-align: center!important;
		line-height: 30px;
		color:#fff;
		margin: 10px 10px 15px 10px!important;
		background:#8898b7;
	}
	.el-tabs__item:nth-child(2),.el-tabs--top.el-tabs--border-card .el-tabs__item:last-child
	{
		padding:0!important;
	}
	.el-tabs--border-card{
		border:none;
	}
	.el-tabs--border-card>.el-tabs__header{
		background:#eff1f6;
		border:none;
		height:65px;
		padding:0 20px;
	}
	.el-tabs--border-card>.el-tabs__content {
		padding:0;
	
	}
	.el-input,.el-select {
		float: left;
		width: 250px!important;
	}
	.el-input__inner{
		border-radius:1px!important;
	}
	.el-form-item__label{
		margin-left:48px;
		padding:0;
		margin-right:20px;
	}
	.el-tabs__nav-wrap.is-scrollable{
		padding:0;
	}
}
// 互动弹窗
.interact {
	.el-tabs--border-card {
		box-shadow: none;
	}
	.el-form {
		margin-top: 20px;
		.label {
			float: left;
			margin: 0 20px 0 25px;
		}
	
		.el-radio-group {
			margin-right: 16px;
		}
	}
	.btn-img {
		height: 115px;
		width: 115px;
		float: left;
	}
	.change-btn{
		float: left;
		margin-left:10px;
		margin-top: 83px;
	}
	.notice-p{text-align:center;}
	.el-dialog__body{
		padding:0!important;
	}
	.el-dialog__footer{
		padding-top:0!important;
	}
	.el-tabs__item{
		height:auto;
		padding:0;
		border:none!important;
		margin-top:10px!important;
	}
	.el-tabs__item  span{
		display:block;
		width:100px;
		height:30px;
		text-align: center!important;
		line-height: 30px;
		color:#fff;
		margin: 10px 10px 15px 10px!important;
	}
	.el-tabs__item:nth-child(2),.el-tabs--top.el-tabs--border-card .el-tabs__item:last-child
	{
		padding:0!important;
	}
	.el-tabs--border-card{
		border:none;
	}
	.el-tabs--border-card>.el-tabs__header{
		background:#eff1f6;
		border:none;
		height:65px;
		padding:0 20px;
	}
	.el-tabs--border-card>.el-tabs__content {
		padding:0;
	
	}
	.el-input,.el-select {
		float: left;
		width: 250px!important;
	}
	.el-input__inner{
		border-radius:1px!important;
	}
	.el-form-item__label{
		margin-left:123px;
		padding:0;
		margin-right:20px;
	}
	.el-tabs__nav-wrap.is-scrollable{
		padding:0;
	}
}
// block下的interaction
.c-interaction{
	.form-item .el-button {
		width: 100%;
		height: 100%;
		background: inherit;
		color: inherit;
		border: 0;
	}
	
	.form-item .el-button--small {
		font-size: inherit;
	}
// 	.randered-img{
// 		width:115px;
// 		height:115px;
// 	}
	.randered-p{
		text-align:center;
	}
	
}
// 未选择图片提示
.no-img-tip{
	position: absolute;
    top: 15px;
    left: 85px;
	color:red;
}
.no-music-tip{
	position: absolute;
	top: 15px;
	left: 100px;
	color:red;
}
// 上传提示图标
.upload-demo .icon-remind{
	color:#c0c4cc;
}
// 选中音乐样式
.bgm-lists .active_bg{
	background:#849bfe!important;
	& span{
		color:#fff!important;
	}
	.el-icon-service{
		color:#fff!important;
	}
}
// 图集整理弹窗
.imgset-sub-dialog{
	.el-dialog__body{
		padding:20px!important;
	}
	.el-dialog__footer{
		padding-top:0!important;
	}
	
}
.animate-scrollbar .el-scrollbar__wrap {
   overflow-x: hidden;
   margin-bottom:0!important;
}
.animate-scrollbar .el-scrollbar__view{
	height: 235px;
	width: 135px;
}
// 暂无图片
.nophoto{
	text-align:center;
	margin:70px auto 140px;
	& img{
		margin-bottom:15px;
	}
	& p{
		color:#909399;
		font-size:16px;
	}
}